/* 头部 */
.head {
	width: 99.4%;
	top: -1rpx;
	position: fixed;
	top: 0rpx;
	background-color: white;
	position: fixed;
	z-index: 100;
}

.head image {
	width: 50rpx;
	height: 50rpx;
	margin-left: 40rpx;
	margin-top: 20rpx;
}

/* 标题 */
.title {
	height: 100rpx;
	/* border: 1px solid magenta; */
	display: flex;
}

.title view {
	width: 33%;
	height: 100%;
	/* border: 1px solid red; */
	text-align: center;
	line-height: 100rpx;
}

.title-active {
	border-bottom: 7rpx solid #ff8000;
}

/* 内容 */
.content {
	height: auto;
	border-bottom: 1px solid #d2d2d2;
	padding: 30rpx;
}

.head-portrait {
	height: 130rpx;
	/* border: 1px solid salmon; */
	display: flex;
}

.head-portrait image {
	width: 120rpx;
	height: 120rpx;
	border-radius: 50%;
}

.head-portrait-info {
	margin-left: 25rpx;
	/* border: 1px solid red; */
	margin-top: 10rpx;
}

.head-portrait-name {
	font-weight: bold;
	color: #565656;
}

.head-portrait-date {
	font-size: 30rpx;
	color: #777777;
}

/* .content-text {
	font-size: 36rpx;
} */
.content-picture {
	/* height: 400rpx; */
	/* border: 1px solid firebrick; */
	display: flex;
	flex-wrap: wrap;
}

.content-picture image {
	width: 32%;
	height: 200rpx;
	margin-left: 10rpx;
	margin-top: 10rpx;
	object-fit: cover;
}

.content-picture image:nth-child(1),
.content-picture image:nth-child(4),
.content-picture image:nth-child(7) {
	margin-left: 0rpx;
}

.site {
	height: 100rpx;
	/* border: 1px solid magenta; */
	margin-top: 10rpx;
	background-color: #f8f8f8;
	display: flex;
	position: relative;
}

.site image {
	width: 130rpx;
	height: 100rpx;
}

.site text {
	width: 500rpx;
	color: #7c7c7c;
	line-height: 100rpx;
	font-size: 36rpx;
	margin-left: 10rpx;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.site-right {
	position: absolute;
	right: 15rpx;
	top: 10rpx;
	font-size: 60rpx;
	color: #84898c;
}

.share {
	height: 60rpx;
	display: flex;
	justify-content: space-around;
	margin-top: 20rpx;
	/* border: 1px solid lawngreen; */
}

.share view {
	vertical-align: middle;
	font-size: 36rpx;
}

.share image {
	width: 50rpx;
	height: 50rpx;
	vertical-align: middle;
	margin-right: 10rpx;
}

.like {
	display: flex;
	height: 80rpx;
	/* border: 1px solid forestgreen; */
	overflow: hidden;
	margin-top: 10rpx;
}

.like image {
	width: 70rpx;
	height: 70rpx;
	margin-left: 10rpx;
}

.like image:nth-child(1) {
	margin: 0 20rpx;
}

.like-head {
	width: 90rpx;
	height: 90rpx;
	border-radius: 50%;
	margin-top: 5rpx;
}

.comment {
	/* height: 100rpx; */
	/* border: 1px solid red; */
	color: #666666;
}

.comment-name {
	color: #6075a4;
}

.more-comment {
	color: #999999;
	margin-top: 10rpx;
}

.perch {
	height: 300rpx;
	/* border: 1px solid rebeccapurple; */
	line-height: 300rpx;
	text-align: center;
	color: #999999;
}
